<template>
  <div>
    <c-table-box ref="taskTable" checkbox hide-func :selected-arry.sync="tableSelected" :other-raw="otherRaw" :other-filters="otherFilter" :table-config="tableConfig" @selection-change="selectionChange">
      <template #btn>
        <c-permission v-if="type==='all'" code="all">
          <c-button type="primary" opt-code="changedesigner" @click="changeConfigurator">变更配置人员</c-button>
          <c-button type="primary" opt-code="export" @click="handleExport">导出</c-button>
        </c-permission>
        <c-permission v-if="type==='allot'" code="allot">
          <c-button type="primary" opt-code="allot" @click="clickHandle">分配任务</c-button>
          <c-button type="primary" opt-code="import" @click="handleImport">导入</c-button>
          <c-button type="primary" opt-code="export" @click="handleExport">导出</c-button>
        </c-permission>
        <c-permission v-if="type==='deal'" code="deal">
          <c-button type="primary" opt-code="deal" @click="clickTaskHandle">处理任务</c-button>
          <c-button type="primary" opt-code="export" @click="handleExport">导出</c-button>
        </c-permission>
      </template>
    </c-table-box>
    <div>
      <designer v-if="showDialog" ref="changeDialog" :visible.sync="showDialog" :detail-data="activedData" @success="refreshTable" />
      <AllocationTask v-if="showEdit" ref="addAllocationTask" :visible.sync="showEdit" :detail-data="activedList" @success="refreshTable" />
      <import-files v-if="importVisible" title="导入" :visible.sync="importVisible" :config="fileImportConfig" @success="handleImportSuccess" />
      <export-files v-if="exportVisible" title="导出" :config="exportAllConfig" :visible.sync="exportVisible" @success="handleExportSuccess" />
    </div>
  </div>
</template>
<script>
// import { otherFiltersItem } from '@/utils'
import AllocationTask from './allocationTask'
import { queryBtnList } from '@/api/basicData'
import Designer from './designer.vue'
export default {
  name: 'List',
  components: {
    AllocationTask,
    Designer
  },
  props: {
    type: {
      type: String,
      default: ''
    },
    otherFilters: {
      type: Array,
      default: () => []
    },
    activeType: {
      type: String,
      default: ''
    },
    serachFilters: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      showDialog: false,
      exportVisible: false,
      importVisible: false,
      allTabBtnList: [],
      allocationBtnList: [],
      pendingBtnList: [],
      activedData: {},
      tableConfig: {
        interfacePath: `${process.env.VUE_APP_BASE_API}/api/v1/productConfigTask/page`,
        hideSearchBar: true,
        sort: 'createTime',
        order: 'DESC',
        apiHeader: { 'Permission-Percode': 'productconfigtask', 'Permission-App': 'slm' },
        setting: [
          {
            prop: 'configTaskCode',
            label: '任务编号',
            isButton: true,
            clickFun: this.toDetail,
            className: 'btn-green'
          },
          {
            prop: 'source',
            label: '任务来源',
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'PRODUCT_CONFIG_TASK_SOURCE'
            },
            minWidth: 100
          },
          {
            prop: 'proConfigType',
            label: '产品配置类型',
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'PRO_CONFIG_TYPE'
            },
            minWidth: 120
          },
          {
            prop: 'schedule',
            label: '任务进度',
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'PRODUCT_CONFIG_TASK_SCHEDULE'
            },
            minWidth: 100
          },
          {
            prop: 'picTaskCode',
            label: '关联图纸',
            minWidth: 100
          },
          {
            prop: 'picTaskName',
            label: '图纸名称',
            minWidth: 100
          },
          {
            prop: 'proConfiguratorName',
            label: '产品配置人员',
            minWidth: 100
          },
          {
            prop: 'constCode',
            label: '门店建设项目号',
            minWidth: 120
          },
          {
            prop: 'shopName',
            label: '所属门店',
            minWidth: 100
          },
          {
            prop: 'officeName',
            label: '所属办事处',
            minWidth: 100
          },
          {
            prop: 'createTime',
            label: '任务生成时间',
            minWidth: 120
          },
          // 设计进度、卖场归档时间、门头归档时间
          {
            prop: 'state',
            label: '设计进度',
            minWidth: 120,
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'SHOP_DESIGN_STATE'
            }
          },
          {
            prop: 'storeFileTime',
            label: '卖场归档时间',
            minWidth: 120
          },
          {
            prop: 'doorFileTime',
            label: '门头归档时间',
            minWidth: 120
          }
        ]
      },
      typeFilters: [],
      activedList: [],
      otherRaw: {},
      // otherFilter: [],
      tableSelected: [],
      showEdit: false,
      tmpOtherFilter: []
    }
  },
  computed: {
    otherFilter() {
      return [...this.serachFilters, ...this.typeFilters]
    },
    exportAllConfig() {
      return [{
        code: 'export',
        name: '配置任务管理',
        dataApi: '/slm-admin/api/v1/productConfigTask/export?type=0',
        selectedRows: this.tableSelected,
        paramsRaw: {},
        filtersRaw: this.otherFilter,
        queryField: 'id'
      }]
    },
    fileImportConfig() {
      return [{
        code: 'importUpdate',
        name: '修改配置任务管理',
        async: false,
        apiUrl: '/slm-admin/api/v1/productConfigTask/importExcel?type=0'
      }]
    }
  },
  watch: {
    type: {
      handler(v) {
        this.setOtherFilters(v)
        this.setAllTable()
      },
      immediate: true
    },
    serachFilters: {
      handler(v) {
        if (this.activeType !== this.type) return
        this.$nextTick(() => {
          this.$refs.taskTable.initTableData()
        })
      }
    }
  },
  created() {
    const menuCode = this.$route.query.menuCode || 'PC2557620'
    queryBtnList(menuCode, 'default').then(res => {
      if (res.success && res.data && res.data.groovyList && (res.data.groovyList.length || res.data.groupList.length)) {
        const btnList = [...res.data.groovyList, ...res.data.groupList]
        this.allTabBtnList = btnList.filter(item => item.buttonCode === 'export')
        this.allocationBtnList = btnList.filter(item => item.buttonCode === 'export' || item.buttonCode === 'import' || item.buttonCode === 'allot')
        this.pendingBtnList = btnList.filter(item => item.buttonCode === 'export' || item.buttonCode === 'deal')
      }
    })
  },
  activated() {
    if (this.ready) {
      this.$nextTick(() => {
        this.$refs.taskTable.initTableData()
      })
    }
  },
  deactivated() {
    this.ready = true
  },
  methods: {
    // 全部
    setAllTable() {
      if (this.type === 'all') {
        const setting = this.tableConfig.setting
        setting.push({
          prop: 'distributeTime',
          label: '任务分配时间'
        },
        {
          prop: 'distributorName',
          label: '任务分配人'
        })
      }
    },
    // 设置过滤条件
    setOtherFilters(type) {
      switch (type) {
        case 'all':
          this.typeFilters = []
          break
        case 'allot':
          { const arr1 = [{ 'id': 'schedule1', 'property': 'schedule', 'operator': '=', 'value': 'A' }]
            this.typeFilters = [...arr1]
            this.otherRaw = { 'isEnd': 0 }
          }
          break
        case 'deal':
          { const arr1 = [{ 'id': 'schedule1', 'property': 'schedule', 'operator': '=', 'value': 'B' }]
            this.typeFilters = [...arr1]
            this.otherRaw = { 'isEnd': 0 }
          }
          break
      }
    },
    // 导入
    handleImport() {
      this.importVisible = true
    },
    // 导入成功
    handleImportSuccess() {
      this.refreshTable()
    },
    // 导出
    handleExport() {
      this.exportVisible = true
    },
    // 变更产品配置人
    changeConfigurator() {
      const arr = ['CUSTOMIZE', 'ACCESSORY', 'RESOURCES']
      if (!this.tableSelected.length) {
        this.$message.warning('请选择【变更产品配置人】项')
        return
      }
      const typeArr = this.tableSelected.some(item => !arr.includes(item.proConfigType))
      if (typeArr) {
        this.$message.warning('该操作仅可变更产品配置类型为【定制类】、【饰品类】、【资源类】的数据')
        return
      }
      const tempArr = this.tableSelected.map(v => v.proConfigType)
      const list = Array.from(new Set(tempArr))
      if (list.length > 1) {
        this.$message.warning('请选择相同产品配置类型')
        return
      }
      this.activedData = this.tableSelected
      this.showDialog = true
    },
    // 处理任务
    clickTaskHandle() {
      if (!this.tableSelected.length) {
        this.$message.warning('请选择【处理任务】项')
        return
      } else if (this.tableSelected.length > 1) {
        this.$message.warning('该操作仅支持单选')
        return
      }
      this.$router.push({ name: 'Handle', params: this.tableSelected[0] })
    },
    selectionChange(data) {
      this.tableSelected = data
    },
    clickHandle() {
      if (!this.tableSelected.length) {
        this.$message.warning('请选择【分配任务】项')
        return
      }
      // else if (this.tableSelected.length > 1) {
      //   this.$message.warning('该操作仅支持单选')
      //   return
      // }
      this.activedList = this.tableSelected
      this.showEdit = true
    },
    // 刷新
    refreshTable(isInit) {
      this.$refs.taskTable.initTableData(isInit ? '' : 'onPage')
    },
    toDetail(row) {
      this.$router.push({ name: 'PCTaskDetail', params: row })
    }
  }
}
</script>
